<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<title>MIS</title>
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" type="text/css"
	href="../../lib/bootstrap/css/bootstrap.css">
<link rel="stylesheet" type="text/css"
	href="../../stylesheets/theme.css">
<link rel="stylesheet"
	href="../../lib/font-awesome/css/font-awesome.css">
<script src="../../lib/jquery.min.js" type="text/javascript"></script>
<script src="../../lib/bootstrap/js/bootstrap.js"></script>
<script src="../../lib/jquery.validate.min.js"></script>
<script src="../../lib/jquery.cookie.js"></script>
<script src="../../js/init.js"></script>
<link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
<script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="lib/html5.js"></script>
<![endif]-->
</head>

<style>
li {list-style-type:none;}
.td{border:solid #000000; border-width:0px 1px 1px 0px; padding:10px 0px;}
.table{border:solid #dddddd; border-width:1px 1px 1px 1px;}
</style>

<!--[if lt IE 7 ]> <body class="ie ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie ie7 "> <![endif]-->
<!--[if IE 8 ]> <body class="ie ie8 "> <![endif]-->
<!--[if IE 9 ]> <body class="ie ie9 "> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->

<body class="">
	<!--<![endif]-->

	<div class="navbar"></div>
	<div class="common"></div>


	<div class="sidebar-nav"></div>

	<div class="content">
		<div class="well">
			<ul class="nav nav-tabs">
				<li class="active"><a href="#userlist" data-toggle="tab">统计数据</a></li>
			</ul>
			<div id="myTabContent" class="tab-content">
				<div class="tab-pane active in" id="userlist">
					<div class="btn-toolbar">
						<form class="form-inline ">
							<div class="row">
								<div class="input-prepend input-append span2">
									<span class="add-on">起始日期</span> 
									<input type="text" id="startDate">
									<span class="add-on">结束日期</span> 
									<input type="text" id="endDate">
									<button type="button" class="btn" id="searchbtn">查询</button>
								</div>
							</div>
						</form>
					</div>
					<div class="tabs">  
					     <ul class="tabs">  
					     	<table style="width: 100%">
					     		<tr>
						     		<td style="width: 20%"><li class="active" style="display:inline"><a href="#page1">个人统计</a></li></td>
						     		<td style="width: 20%"><li style="display:inline"><a href="#page2">企业统计</a></li></td>
						     		<td style="width: 20%"><li style="display:inline"><a href="#page3">实习岗位统计</a></li></td>
						     		<td style="width: 20%"><li style="display:inline"><a href="#page4">兼职岗位统计</a></li></td>
						     		<td style="width: 20%"><li style="display:inline"><a href="#page5">概率统计</a></li></td>
					     		</tr>
					     	</table>
    					</ul> 
					    <div class="tabcontent">  
					        <div id="page1" class="tab_content" style="display: block; ">
					        <table style="width: 100%">
					        	<tr>
					        		<td colspan="3">
							        		注册人数：<div id="personCount"></div>
									</td>
					        	</tr>
					        	<tr>
					        		<th style="width: 20%;background-color: #dddddd">
					        			<label class="control-label">按学历分布</label>
					        		</th>
					        		<td style="width: 2.5%"></td>
					        		<th style="width: 20%;background-color: #dddddd">
					        			<label class="control-label">按地区分布</label>
					        		</th>
					        		<td style="width: 2.5%"></td>
					        		<th style="width: 20%;background-color: #dddddd">
					        			<label class="control-label">求职意向－实习</label>
					        		</th>
					        		<td style="width: 2.5%"></td>
					        		<th style="width: 20%;background-color: #dddddd">
					        			<label class="control-label">求职意向－兼职</label>
					        		</th>
					        		<td style="width: 2.5%"></td>
					        	</tr>
					        	<tr>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC">
											<thead>
												<tr>
													<th>学历名称</th>
													<th>注册人数</th>
												</tr>
											</thead>
											<tbody id="educationList">
				
											</tbody>
										</table>
					        		</td>
					        		<td></td>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC" >
											<thead>
												<tr>
													<th>地区名称</th>
													<th>注册人数</th>
												</tr>
											</thead>
											<tbody id="districtList">
				
											</tbody>
										</table>
					        		</td>
					        		<td></td>
					        			        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC">
											<thead>
												<tr>
													<th>职位类型</th>
													<th>职位名称</th>
													<th>意向人数</th>
												</tr>
											</thead>
											<tbody id="internshipList">
				
											</tbody>
										</table>
					        		</td>
					        		<td></td>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC" >
											<thead>
												<tr>
													<th>职位名称</th>
													<th>意向人数</th>
												</tr>
											</thead>
											<tbody id="parttimeList">
				
											</tbody>
										</table>
					        		</td>
					        		<td></td>
					        	</tr>
					        </table>
					        </div>  
					        <div id="page2" class="tab_content" style="display: block; ">
					        <table >
					        	<tr>
					        		<td >
							        	注册公司数：<div id="companyCount"></div>
									</td>
					        	</tr>
					        	<tr>
					        		<th style="background-color: #dddddd">
					        			<label class="control-label">按领域分布</label>
					        		</th>
					        	</tr>
					        	<tr>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC">
											<thead>
												<tr>
													<th>领域名称</th>
													<th>注册公司数</th>
												</tr>
											</thead>
											<tbody id="companyFieldList">
				
											</tbody>
										</table>
					        		</td>
					        	</tr>
					        </table>
					        </div>  
					        <div id="page3" class="tab_content" style="display: block; ">
					        <table style="width: 100%">
					        	<tr>
					        		<td colspan="3">
							        		新增实习岗位数：<div id="intenrshipCount"></div>
									</td>
					        	</tr>
					        	<tr>
					        		<th style="width: 40%;background-color: #dddddd">
					        			<label class="control-label">按领域分布</label>
					        		</th>
					        		<td style="width: 20%"></td>
					        		<th style="width: 40%;background-color: #dddddd">
					        			<label class="control-label">按地区分布</label>
					        		</th>
					        	</tr>
					        	<tr>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC">
											<thead>
												<tr>
													<th>领域名称</th>
													<th>岗位</th>
												</tr>
											</thead>
											<tbody id="internshipFieldList">
				
											</tbody>
										</table>
					        		</td>
					        		<td></td>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC" >
											<thead>
												<tr>
													<th>地区名称</th>
													<th>注册人数</th>
												</tr>
											</thead>
											<tbody id="internshipDistrictList">
				
											</tbody>
										</table>
					        		</td>
					        	</tr>
					        </table>
					        </div>  
					        <div id="page4" class="tab_content" style="display: block; ">
					        <table style="width: 100%">
					        	<tr>
					        		<td colspan="3">
							        		新增兼职岗位数：<div id="parttimeCount"></div>
									</td>
					        	</tr>
					        	<tr>
					        		<th style="width: 40%;background-color: #dddddd">
					        			<label class="control-label">按领域分布</label>
					        		</th>
					        		<td style="width: 20%"></td>
					        		<th style="width: 40%;background-color: #dddddd">
					        			<label class="control-label">按地区分布</label>
					        		</th>
					        	</tr>
					        	<tr>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC">
											<thead>
												<tr>
													<th>领域名称</th>
													<th>岗位</th>
												</tr>
											</thead>
											<tbody id="parttimeFieldList">
				
											</tbody>
										</table>
					        		</td>
					        		<td></td>
					        		<td valign="top">
					        			<table class="table" style="background-color: #FCFCFC" >
											<thead>
												<tr>
													<th>地区名称</th>
													<th>注册人数</th>
												</tr>
											</thead>
											<tbody id="parttimeDistrictList">
				
											</tbody>
										</table>
					        		</td>
					        	</tr>
					        </table>
					        </div>  
					        <div id="page5" class="tab_content" style="display: block; ">
					        	<div class="control-group">
									<label class="control-label">个人投递成功率：</label> <label id="personRatio">
									</label>
								</div>
								<div class="control-group">
									<label class="control-label">个人投递查看率：</label> <label id="checkRatio">
									</label>
								</div>
								<div class="control-group">
									<label class="control-label">企业邀请成功率：</label> <label id="companyRatio">
									</label>
								</div>
								<div class="control-group">
									<label class="control-label">企业邀请参加面试率：</label> <label id="interviewRatio">
									</label>
								</div>
					        </div>  
					    </div>  
					</div>  

					
					
				</div>
			</div>
		</div>
	</div>

	<script type="text/javascript">
	$(document).ready(function() {  
	    //Default Action  
	    $(".tab_content").hide(); //Hide all content  
	    $("ul.tabs a:first").addClass("active").show(); //Activate first tab  
	    $(".tab_content:first").show(); //Show first tab content  
	      
	    //On Click Event  
	    $("ul.tabs li").click(function() {  
	        $("ul.tabs a").removeClass("active"); //Remove any "active" class  
	        $(this).addClass("active"); //Add "active" class to selected tab  
	        $(".tab_content").hide(); //Hide all tab content  
	        var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content  
	        $(activeTab).fadeIn(); //Fade in the active content  
	        return false;  
	    });  
	  
	}); 

		$(function() {
			initAdminNavBar();
			initCommon();
			initSideBar('user-management', 'data-list');
			reloadtable();
		    $("#startDate").datepicker();
		    $("#endDate").datepicker();
			$('#searchbtn').on('click', function(e) {
				reloadtable();
			});
		});

		function reloadtable() {
			var startDate = $('#startDate').val();
			var endDate = $('#endDate').val();

			$.ajax({
						contentType : "application/json",
						url : api_base_url + "statistics1.json?"
								+ "startDate=" + startDate + "&endDate="
								+ endDate,
						dataType : "json",
						type : "get",
						success : function(data) {
							//alert(data);
							if (data.code == "200") {
								loadTab1(data.responseData.personCount, data.responseData.educationList, data.responseData.districtList, data.responseData.internshipList, data.responseData.parttimeList);			
								loadTab2(data.responseData.companyCount, data.responseData.companyFieldList);
								loadTab3(data.responseData.intenrshipCount, data.responseData.internshipFieldList, data.responseData.internshipDistrictList);
								loadTab4(data.responseData.parttimeCount, data.responseData.parttimeFieldList, data.responseData.parttimeDistrictList);
								loadTab5(data.responseData.personRatio, data.responseData.companyRatio, data.responseData.checkRatio, data.responseData.interviewRatio);
							}else{
								
							}
						}
					});
		}
		
		function loadTab1(personCount, educationList, districtList, internshipList, parttimeList){
			$("#personCount").html(personCount);
			var rows1 = '';
			for (var i1 = 0; i1 < educationList.length; i1++) {
				rows1 += "<tr>";
				rows1 += "<td>"
						+ educationList[i1].dicEducationName
						+ "</td>";
				rows1 += "<td>"
						+ educationList[i1].educationCount
						+ "</td>";
				rows1 += "</tr>";
			}
			$('#educationList').html(rows1);
			var rows2 = '';
			for (var i2 = 0; i2 < districtList.length; i2++) {
				rows2 += "<tr>";
				rows2 += "<td>"
						+ districtList[i2].dicDistrictName
						+ "</td>";
						rows2 += "<td>"
						+ districtList[i2].districtCount
						+ "</td>";
						rows2 += "</tr>";
			}
			$('#districtList').html(rows2);
			var rows3 = '';
			for (var i3 = 0; i3 < internshipList.length; i3++) {
				rows3 += "<tr>";
				rows3 += "<td>"
						+ internshipList[i3].category
						+ "</td>";
				rows3 += "<td>"
						+ internshipList[i3].dicFieldName
						+ "</td>";
				rows3 += "<td>"
						+ internshipList[i3].internshipCount
						+ "</td>";
				rows3 += "</tr>";
			}
			$('#internshipList').html(rows3);
			var rows4 = '';
			for (var i4 = 0; i4 < parttimeList.length; i4++) {
				rows4 += "<tr>";
				rows4 += "<td>"
						+ parttimeList[i4].dicFieldName
						+ "</td>";
				rows4 += "<td>"
						+ parttimeList[i4].parttimeCount
						+ "</td>";
				rows4 += "</tr>";
			}
			$('#parttimeList').html(rows4);
			
		}
		
		function loadTab2(companyCount, companyFieldList){
			$("#companyCount").html(companyCount);
			var rows1 = '';
			for (var i1 = 0; i1 < companyFieldList.length; i1++) {
				rows1 += "<tr>";
				rows1 += "<td>"
						+ companyFieldList[i1].fieldName
						+ "</td>";
				rows1 += "<td>"
						+ companyFieldList[i1].fieldCount
						+ "</td>";
				rows1 += "</tr>";
			}
			$('#companyFieldList').html(rows1);
		}
		
		function loadTab3(intenrshipCount, internshipFieldList, internshipDistrictList){
			$("#intenrshipCount").html(intenrshipCount);
			var rows1 = '';
			for (var i1 = 0; i1 < internshipFieldList.length; i1++) {
				rows1 += "<tr>";
				rows1 += "<td>"
						+ internshipFieldList[i1].dicFieldName
						+ "</td>";
				rows1 += "<td>"
						+ internshipFieldList[i1].internshipCount
						+ "</td>";
				rows1 += "</tr>";
			}
			$('#internshipFieldList').html(rows1);
			var rows2 = '';
			for (var i2 = 0; i2 < internshipDistrictList.length; i2++) {
				rows2 += "<tr>";
				rows2 += "<td>"
						+ internshipDistrictList[i2].dicDistrictName
						+ "</td>";
						rows2 += "<td>"
						+ internshipDistrictList[i2].intenrshipDistrictCount
						+ "</td>";
						rows2 += "</tr>";
			}
			$('#internshipDistrictList').html(rows2);
			
		}
		function loadTab4(parttimeCount, parttimeFieldList, parttimeDistrictList){
			$("#parttimeCount").html(parttimeCount);
			var rows1 = '';
			for (var i1 = 0; i1 < parttimeFieldList.length; i1++) {
				rows1 += "<tr>";
				rows1 += "<td>"
						+ parttimeFieldList[i1].dicFieldName
						+ "</td>";
				rows1 += "<td>"
						+ parttimeFieldList[i1].parttimeFieldCount
						+ "</td>";
				rows1 += "</tr>";
			}
			$('#parttimeFieldList').html(rows1);
			var rows2 = '';
			for (var i2 = 0; i2 < parttimeDistrictList.length; i2++) {
				rows2 += "<tr>";
				rows2 += "<td>"
						+ parttimeDistrictList[i2].dicDistrictName
						+ "</td>";
						rows2 += "<td>"
						+ parttimeDistrictList[i2].parttimeDistrictCount
						+ "</td>";
						rows2 += "</tr>";
			}
			$('#parttimeDistrictList').html(rows2);
			
		}
		function loadTab5(personRatio, companyRatio, checkRatio, interviewRatio){
			$('#personRatio').html(personRatio);
			$('#companyRatio').html(companyRatio);
			$('#checkRatio').html(checkRatio);
			$('#interviewRatio').html(interviewRatio);
		}
	</script>
</body>
</html>


